//初始化区域滚动组件
mui('.mui-scroll-wrapper').scroll({
    indicators:false
})

$(function(){
	//1.页面加载数据
	//1.1 获取页面的productId
	var productId = lt.getUrlParams().productId
	var render = function(){
		//1.2 请求获取数据
		getProductDetails({
			id:productId,

		},function(res){
			//1.3 动态渲染
			console.log(res);
			$('.mui-scroll').html(template('productDetails',res))
			//1.4 初始化轮播图
			mui('.mui-slider').slider({
   				 interval:4000
			})
			//1.5 数量选择初始化
			mui('.mui-numbox').numbox();
		})
	}
	render()

	//2.0 重新加载
	$('.mui-icon-reload').on('tap',function(){
		// 页面是怎么看见加载动画的？
		//添加类名，先在要动态渲染的DIV下设置有动画类名的盒子
		//动态渲染后，模板会从新赋值HTML，动画消失
		$('.mui-scroll').html('<div class="loading"><span class="mui-icon mui-icon-spinner"></span></div>')
		render()
	})

	//3.0 尺码选择
	$('.mui-scroll').on('tap','.size',function(){
		$(this).addClass('now').siblings().removeClass('now')
	})



/*4. 去购物车 */
    /* 加入购物车
    (1.) 需要获取  数据（商品id 尺码 数量） 校验数据
    (2.) 通过接口发送给后台 ajax
    (3.) 成功  提示用户  添加成功  弹出一个对话框  去购物车查看
    (4.) 失败  提示用户  添加失败
    (5.) 防止二次提交*/
    $('.mui-btn-danger').on('tap',function(){
    	//防止重复提交
    	if(window.addCarting){
    		return
    	}
    	//4.1 去购物车必须要传递的三个参数 productId num size
    	var params = {
    		productId:productId,
    		num:$('.mui-input-numbox').val(),
    		size:$.trim($('.size.now').html())//去空白
    	}
    	console.log(params)
    	//4.2 验证信息安全
    	if(!params.productId){
    		mui.toast('商品id异常')
    		return
    	}
    	if(!params.size){
    		mui.toast('请选择尺码')
    		return
    	}
    	if(!params.num){
    		mui.toast('请选择购买数量')
    		return
    	}

    	//4.3 发送ajax请求
    	$.ajax({
    		type:'post',
    		url:'/cart/addCart',
    		async:true,
    		data:params,
    		beforeSend:function(){
    			window.addCarting = true
    		},
    		success:function(res){
    			console.log(res);
    			if(res.success){
    				//此处需要判断是否登录成功
    				//..........
    			} else {
    				mui.toast('添加失败，请重试！')
    			}
    		//失败或者成功都代表可以下一次的添加购物车了，关闭节流阀开关
    			window.addCarting = false
    		},
    		error:function(){
    			mui.toast('网络繁忙')
    			window.addCarting = false
    		}
    	})
    })
})

function getProductDetails(params,callback){
	$.ajax({
		type:'get',
		url:'/product/queryProductDetail',
		async:true,
		data:params,
		success:function(res){
			setTimeout(function(){
				callback && callback(res)
			},500)
		}
	})
}
